import {
    BooleanData, BtnShape, BtnType,
    DateData,
    DateOptions,
    DrawerPlacement,
    fieldView,
    FormLayout,
    FormOther, MethodData, SelectionRowData,
    SelectMode,
    TableSizeData,
    Validate
} from '@/components/OptionsMetaData'
import {EventBus, EventType} from "@/event";

const drawerMetas = [
    {title: '标题', field: 'title', type: "text", default: '抽屉表单'},
    {title: '抽屉方向', type: 'radio', field: 'placement', data: DrawerPlacement, default: 'right'},
    {field: 'drawerRate', title: '宽/高', type: 'text', extra: '支持数值和百分比', default: '420'},
    {title: '展示遮罩', type: 'radio', field: 'mask', data: BooleanData, default: true},
    {title: '蒙层关闭', type: 'radio', field: 'maskClosable', data: BooleanData, default: true},
];
const modalBasicMetas = [
    {title: '标题', field: 'title', type: "text", default: '模态框表单'},
    {title: '居中', field: 'centered', type: "radio", default: false, data: BooleanData},
]
const modalOtherMetas = [
    {title: '显示遮罩', field: 'mask', type: "radio", default: true, data: BooleanData},
    {title: '遮罩关闭', field: 'maskClosable', type: "radio", default: false, data: BooleanData},
    {title: '关闭图标', field: 'closable', type: "radio", default: true, data: BooleanData},
]
const modalLayoutMetas = [
    {title: '宽', field: 'width', type: "text", default: '520px'},
    {title: '高', field: 'height', type: "text", default: '280px'},
]
const editFunButtonMetas = [
    {title: '取消', field: 'cancel', type: 'btn'},
    {title: '确定', field: 'cancel', type: 'btn'},
]

const btnMetas = [
    {title: '类型', field: 'btnType', type: 'select', data: BtnType, default: 'default'},
    {title: '形状', field: 'shape', type: 'select', data: BtnShape, default: null},
    {title: 'ghost', field: 'ghost', type: 'radio', data: BooleanData, default: false},
    {title: 'block', field: 'block', type: 'radio', data: BooleanData, default: false},
]

const labelMetas = [
    {field: 'content', title: '文本', type: 'text'}
]
/**
 * 表单基础配置元
 * @type {({field: string, rules: [{message: string, required: boolean}], placeholder: string, title: string, type: string}|{field: string, change: change, rules: [{message: string, required: boolean}], placeholder: string, title: string, type: string}|{lengthDisabled: boolean, field: string, data: *, change: change, lengthField: string, rules: [{message: string, required: boolean}], title: string, type: string}|{field: string, data: *, change: change, title: string, type: string}|{field: string, data: *, change: change, title: string, type: string})[]}
 */
const formCommonMetas = [
    {field: 'desc', title: '表单配置', type: 'divider'},
    {field: 'title', title: '字段标题', type: 'text', rules: [{required: true, message: ''}]
        , placeholder: '字段标题(用户名)', change: (val, meta, model)=>{
            model['comment'] = val;
        }, blur: (val, meta, model) => {
            let id = model['id'];
            EventBus.publish(EventType.formTitle, {val, id});
        }
    },
    {field: 'field', title: '表单字段', type: 'text', placeholder: '表单字段名(userName)'
        , rules: [{required: true, message: ''}], blur: (val, meta, model) => {
            EventBus.publish(EventType.formField, {val, id: model['id']});
        }},
    {field: 'otherForm', title: '操作属性', type: 'checkbox', data: FormOther
        , change: (val, meta, model)=>{
            model['clear'] = val.includes('clear') || false;
            model['disabled'] = val.includes('disabled') || false;
            if(val.includes('required')) {
                model.rules.push({required: true, message: '必填'});
            } else {
                model.rules.length = 0;
            }
        }, default: [], realField: {clear: false, disabled: false, rules: []},
    },
    {title: '校验', field: 'validate', type: 'validate', data: Validate},
    {title: '显示到', field: 'fieldView', type: 'checkbox', data: fieldView
        , change: (val, meta, model)=>{
            let isSearch = val.includes('search');
            let isTable = val.includes('table');
            model['isForm'] = val.includes('form');
            model['isDetail'] = val.includes('detail');
            if(isSearch != model['isSearch']) {
                let {title, field, id, type} = model;
                let meta = {id, title, field, type};
                EventBus.publish(EventType.toSearch, meta)
            }
            if(isTable != model['isTable']) {
                let {title, field, id, type} = model;
                let meta = {id, title, field, type};
                EventBus.publish(EventType.toTable, meta)
            }
            model['isTable'] = isTable;
            model['isSearch'] = isSearch;
        }, default: ['table', 'form'], realField: {
            isSearch: false, isTable: true, isForm: true, isDetail: false
        }},
];
const operaMetas = [
    {field: 'desc', title: '其他配置', type: 'divider'},
    {field: 'placeholder', title: '占位内容', type: 'text', placeholder: '表单说明（请输入用户名）'},
    {field: 'extra', title: 'extra', type: 'text', placeholder: 'antdv表单的extra属性'},
];
const formCommonLayoutMetas = [
    {title: '列布局', field: 'formCol', type: 'slider', change: (val, meta, model) => {
            if(val[0] + val[1] > 24) return;
            model.labelCol = {span: val[0]};
            model.wrapperCol = {span: val[1]};
        }, range: true, default: [7, 15], min: 3, max: 21, step: 1
        , marks: {3: '3', 6: '标签', 12: '12', 18: '表单', 21: '21'}
        , realField: {labelCol: {span: 7}, wrapperCol: {span: 15}}
    }
]
const editLayoutMetas = [
    // {field: 'layout', title: '布局方式', type: 'radio', data: FormLayout, default: 'horizontal'},
    {field: 'column', title: '列数', type: 'slider', change: (val, meta, model) => {
            model.column = val;
        }, min: 1, max: 4, step: 1, default: 1,
        marks: {1: '1列', 2: '2', 3: '3列', 4: '4列'}
    },

    ...formCommonLayoutMetas
]

const formLayoutMetas = [
    {field: 'span', title: 'span', type: 'slider', min: 0, step: 1, max: 24
        , marks: {0: '自动', 6: '6', 18: '18', 24: '24'}, default: 0
    },
    ...formCommonLayoutMetas
];
const searchLayoutMetas = [
    {title: '列数', field: 'column', type: 'slider', change: (val, meta, model) => {
            model.column = val;
        }, min: 1, max: 4, step: 1, default: 3, marks: {1: '1列', 2: '2列', 3: '3列', 4: '4列'}
    },

    ...formCommonLayoutMetas
]
let inputMetas = [
    {title: '前缀图标', field: 'prefix', type: 'select', data: [{label: 'step-backward', value: 'step-backward'}]},
    {title: '后缀图标', field: 'suffix', type: 'select', data: [{label: 'step-backward', value: 'step-backward'}]},
]
let areaMetas = [
    {field: 'autosize', title: '行数', type: 'slider', min: 1, max: 100, step: 1
        , range: true, marks: {1: '最小', 80: '最大', 100: '自动'}, default: [1, 100]}
]
let numberMetas = [
    {title: '步长', field: 'step', type: 'number', default: 1},
    {title: '最小值', field: 'min', type: 'number', default: -2147483648},
    {title: '最大值', field: 'max', type: 'number', default: 2147483648},
    {title: '精度', field: 'precision', type: 'number', default: 0},
]
let rateMetas = [
    {field: 'allowHalf', title: '允许半选', type: 'radio', data: BooleanData},
    {field: 'count', title: 'star 总数', type: 'number', default: 5},
]
let switchMetas = [
    {field: 'checkedChildren', title: '选中内容', type: 'text'},
    {field: 'unCheckedChildren', title: '非选中内容', type: 'text'},
]
let sliderMetas = [
    {title: '步长', field: 'step', type: 'number', default: 1},
    {title: '最小值', field: 'min', type: 'number', default: 18},
    {title: '最大值', field: 'max', type: 'number', default: 100},
    {title: '双滑块', field: 'range', type: 'radio', default: false
        , data: BooleanData, change(val, meta, model) {
            if(val) {
                model[meta.id] = [];
            } else {
                model[meta.id] = 5;
            }
        }},
    {title: '刻度标记', field: 'isMarks', type: 'area', placeholder: "{18: '18°', 64: '64°', 80: '80°'}"
        , realField: {marks: {}}, change(val, meta, model) {
            try {
                let parse = eval('('+val+')')

                model['marks'] = parse;
                model['isMarks'] = val;
            } catch (e) {}
        }},
    {field: 'desc', title: '其他配置', type: 'divider'},
]
const dateMetas = [
    {field: 'dateType', title: '类型', type: 'select', data: DateData, default: 'date'},
    {title: '日期格式', field: 'format', type: 'text', default: 'YYYY-MM-DD HH:mm:ss'},
    {title: '快捷按钮', field: 'show', type: 'checkbox', data: DateOptions
        , change: (val, meta, model)=>{
            model['showTime'] = val.includes('showTime');
            model['showToday'] = val.includes('showToday');
        }, realField: ['showTime', 'showToday'], default: []},
    {title: '表日期格式', field: 'viewFormat', type: 'text', default: 'YYYY-MM-DD'}
]
const selectMetas = [
    {field: 'mode', title: '模式', type: 'select', data: SelectMode, default: 'default'},
    {field: 'showSearch', title: '过滤', type: 'radio', data: BooleanData, default: false},
    {field: 'maxTagCount', title: '最大选中数', type: 'number', default: 3},
]
const searchFormMetas = [
    {field: 'title', title: '字段标题', type: 'text'},
    {field: 'field', title: '表单字段', type: 'text', disabled: true}
]
const tableMetas = [
    // {field: 'title', title: '标题', type: "text"},
    {field: 'page', title: '是否分页', type: 'radio', data: BooleanData, default: true},
    {field: 'bordered', title: '显示边框', type: 'radio', data: BooleanData, default: true},
    {field: 'size', title: '尺寸', type: "radio", data: TableSizeData, default: 'middle'},
    // {field: 'showHeader', title: '显示头', type: 'radio', data: BooleanData, default: true}
]
/**
 * checkbox、radio、select、tree等組件的数据源
 * @type {{field: string, title: string, type: string}[]}
 */
const optionsDataMetas = [
    {title: '数据源', field: 'dataType', type: 'options'},
]

export {formCommonMetas, optionsDataMetas, editLayoutMetas, drawerMetas, operaMetas, formLayoutMetas
    , sliderMetas, inputMetas, numberMetas, rateMetas, switchMetas, areaMetas, dateMetas, selectMetas
    , searchFormMetas, tableMetas, searchLayoutMetas, modalBasicMetas, modalLayoutMetas, modalOtherMetas
    , btnMetas, labelMetas}
